<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<title>Document</title>
	<script src="../lib/vue.js"></script>
</head>
<body>
	<div id="box">
		<aaa></aaa>
	</div>

	<script>
		var Aaa = Vue.extend({
			// 组件里放数据，data必须是函数的形式，函数必须return一个json对象,methods跟之前一样
			data:function(){
				return {
					msg: "hello!"
				}
			},
			methods: {
				change: function(){
					this.msg = "I'm a developer"
				}
			},
			template:"<h3 @click='change()'>{{msg}}</h3>"
		});

		new Vue({
			el:"#box",
			data:{},
			components:{
				"aaa":Aaa
			}
		})
	</script>
</body>
</html>